<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="format-detection" content="telephone=no">
	<title>视频页</title>
</head>
<link rel="stylesheet" type="text/css" href="../styles/index.css">
<script type="text/javascript">
	(function (doc, win) {
        var docEl = doc.documentElement,
            resizeEvt = 'onorientationchange' in window ? 'onorientationchange' : 'resize',
            recalc = function () {
                var clientWidth = docEl.clientWidth;
                if (!clientWidth) return;
                if(clientWidth>=750){
                    docEl.style.fontSize = '20px';
                }else{
                    docEl.style.fontSize = 20 * (clientWidth / 750) + 'px';
                }
            };

        if (!doc.addEventListener) return;
        win.addEventListener(resizeEvt, recalc, false);
        doc.addEventListener('DOMContentLoaded', recalc, false);
    })(document, window);
</script>
<body>
	<div class="warp">
		<section class="videoChat">
			<div class="videoBox">
				<video width="100%" controls="controls">
				  <source src="../images/movie.ogg" type="video/ogg">
				  <source src="../images/movie.mp4" type="video/mp4">
					Your browser does not support the video tag.
				</video>
				<div class="videoAbs">
					<div class="title">离广告结束还有 <span>15</span> 秒</div>
					<div class="img">
						<a href=""><img src="../images/temp/wei.png"></a>
					</div>
				</div>
			</div>
			<div class="title">
				<h1>好的简历是你成功的第一步</h1>
				<div class="titleInfo">
					<p class="people">作者/分享人<span>Monkey</span></p>
					<div class="playBox">
						<p class="playSize"><span>高清</span><i></i></p>
						<p class="playNum"><span>7.8分</span> · 100亿次播放</p>
						<ul>
							<li>超清</li>
							<li>高清</li>
							<li>普清</li>
						</ul>
					</div>
				</div>
			</div>
			<div class="link">
				<a href="">查看本场Chat</a>
			</div>
			<div class="mackCont">
				2017年5月17日晚8点30分，支付平台架构师李艳鹏老师带来了主题为《白话阿里巴巴Java开发手册高级篇》的交流。以下是主持人张爽整理的问题精华，记录了作者和读者间问答的精彩片段。
				内容提要：

				关于DTO/DO/VO，有没有好的来源实现案例可以参考？特别是在做微服务化的时候，如何合理使用它们？
				状态流转、维护可用余额等最好直接利用数据库的行级锁，不需要显式的加锁。可否举例一些适合使用乐观锁的例子？
				1.4以下JDK已经解决了内存可见性的问题，请问是采用什么机制，让使用者不用显式使用volatile或者类变量等手段达到happened-before原则？
				强制POJO 类必须写 toString 方法。使用 IDE 的中工具:source> generate toString 时，如果继承了另一个 POJO 类，注意在前面加一下 super.toString。 每次修改POJO的时候，都需要执行一次generate toString，如果忘了怎么办，无疑增加出错概率，是否在toString方法中用toJson比较好？
				Java Web的项目，异常日志在哪一层记录？
				一个方法里面既有数据库操作也有外部API接口调用，请问事务超时时间如何考虑？
				开发手册怎么和checkstyle结合起来用？
				有没有相关文档提供下？
				可以简单介绍一下支付和渠道风控的架构吗？阿里有自己的风控体系，那么风控这个岗位是不是对数据分析和挖掘方面有极高的要求？
				A应用调用B服务接口，B服务调用C服务接口，如果C接口出现异常，该如何处理？
				self4j API 通过占位符的方式可是代码更加清晰，那么占位符的方式是否会有性能问题？底层的实现应该是查找占位符后替换，是否在记录日志时直接拼接会更好？
				日志目前没有一个规范的要求，我一般是在这几个地方打印日志：外部接口调用的前后；本地对外接口的入参；本地对外出参 ，这样可以吗？
				<div class="more">
					<a href="">继续阅读￥1</a>
				</div>
			</div>
			<div class="mackClick">
				<a class="mClick" href="javascript:void(0)">写评论</a>
			</div>
			
			<div class="circleInfo">
				<ul>
					<li>
						<p class="logos"><img src="../images/bgs/logos.png"></p>
						<p class="name">小罗</p>
						<p class="time">2017-05-09 20:30</p>
						<p class="cont">
							Arrt
						</p>
						<p class="click">
							<span class="goods"></span>
							<span class="msgs mClick"></span>
						</p>
						<div class="info">
							<p class="infoTop">
								<i></i>
								<span>小罗</span>,
								<span>王总</span>,
								<span>孙总的小秘书</span>,
								<span>小罗</span>,
								<span>王总</span>,
								<span>孙总的小秘书</span>,
								<span>小罗</span>,
								<span>孙总的小秘书</span>,
								<span>孙总</span>
								<span>小罗</span>,
								<span>王总</span>,
								<span>孙总的小秘书</span>,
								<span>小罗</span>,
								<span>王总</span>,
								<span>孙总的小秘书</span>,
								<span>小罗</span>,
								<span>孙总的小秘书</span>,
								<span>孙总</span>
							</p>
							<ul>
								<li><span>小罗</span> ：RttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRtt</li>
								<li><span>小罗</span> ：Rtt</li>
							</ul>
						</div>
					</li>
					<li>
						<p class="logos"><img src="../images/temp/logo2.jpg"></p>
						<p class="name">小罗</p>
						<p class="time">2017-05-09 20:30</p>
						<p class="cont">
							Arrt
						</p>
						<p class="click">
							<span class="goods active"></span>
							<span class="msgs mClick"></span>
						</p>
						<div class="info">
							<p class="infoTop">
								<i></i>
								<span>小罗</span>,
								<span>王总</span>,
								<span>孙总的小秘书</span>,
								<span>小罗</span>,
								<span>王总</span>,
								<span>孙总的小秘书</span>,
								<span>小罗</span>,
								<span>孙总的小秘书</span>,
								<span>孙总</span>
								<span>小罗</span>,
								<span>王总</span>,
								<span>孙总的小秘书</span>,
								<span>小罗</span>,
								<span>王总</span>,
								<span>孙总的小秘书</span>,
								<span>小罗</span>,
								<span>孙总的小秘书</span>,
								<span>孙总</span>
							</p>
							<ul>
								<li><span>小罗</span> ：RttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRttRtt</li>
								<li><span>小罗</span> ：Rtt</li>
							</ul>
						</div>
					</li>
				</ul>
			</div>
			
		</section>
		
		<section class="operate">
			<ul>
				<li>
					<a href="">
						<i class="chat01"></i>
						评论
					</a>
				</li>
				<li>
					<a href="">
						<i class="chat02"></i>
						点赞
					</a>
				</li>
				<li>
					<a href="">
						<i class="chat03"></i>
						更多
					</a>
				</li>
			</ul>
		</section>
	</div>
</body>
<script src='../js/jquery-1.9.1.js'></script>
<script src='../js/common.js'></script>
<script type="text/javascript">
	$(function(){
		//评论弹窗
		$('.mClick').click(function(){
			$(document).popUp('<div class="popBox">'+
				'<div class="popInfo pingLun">'+
					'<p class="title">文章评论<span class="popClose"></span></p>'+
					'<form>'+
						'<div class="textBox">'+
							'<textarea class="textarea"></textarea>'+
							'<p class="msg"><span>0</span>/200</p>'+
						'</div>'+
						'<div class="clickBox">'+
							'<button>提交</button>'+
						'</div>'+
					'</form>'+
				'</div>'+
			'</div>');
		});

		//点赞
		$('.circleInfo .goods').click(function(){
			$(this).toggleClass('active');
		})

		//选择视频清晰度
		$('.playBox .playSize').click(function(){
			$('.playBox .playSize').addClass('on');
			$('.playBox ul').show();
		})
		$('.playBox ul li').click(function(){
			var title=$(this).html();
			$('.playBox .playSize span').html(title);
			$('.playBox ul').hide();
			$('.playBox .playSize').removeClass('on');
		})

		//视频广告倒计时
		var sTime=15;
		var startTime=setInterval(function(){
			if(sTime<1){
				clearInterval(startTime);
				$('.videoAbs').hide();
			}else{
				sTime--;
				$('.videoAbs .title span').html(sTime)
			}
		},1000)

	})
</script>
</html>